<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link rel="stylesheet" href="../../res/layui/css/layui.css" media="all">
		<link rel="stylesheet" href="../../res/css/common/font-awesome.min.css" media="all">
		<link rel="stylesheet" href="../../res/layui-config/css/app.css" media="all">
		<script src="../../res/js/common/jquery-1.11.2.min.js"></script>
		<title>采购管理</title>
		<script>
			$(function(){
				var   buyId=getParameter("id");
				if(buyId!=null){
					var url="../../buyDetail/findById.action";
					var data={"id":buyId};
					$.post(url,data,function(mes){
						$.each(mes,function(i,item){
							$("#tbo").append("<tr><td>"+item.drugName+"</td><td><input type='number' id='up_"+item.bdetFkId+"' class='numbers' style='height:20px; border:0px; width:80px;' onKeyUp='num(this)' value='1' /></td><td id='pic_"+item.bdetFkId+"'>"+item.bdetPrice+"</td><td>"+item.drugUnit+"</td><td><input type='text' id='mes_"+item.bdetFkId+"' style='height:20px; border:0px; width:200px;' onKeyUp='pj()'/></td><td id='total'>"+item.bdetPrice+"</td><td><a onclick='delrow(this);' class='dels'>删除</a></td><td style='display:none;'><input type='text' id='drugId' value='"+item.bdetFkId+"' /></td></tr>")
				        });
						pj();
					},"json");
				}
				
				
			})
		</script>
		<style>
			#kit-table{
				margin-top:30px;
			}
		</style>
	</head>
	<body>
	
	<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
  <legend>采购详情</legend>
	</fieldset>
	<div>
	总金额：
	<div class="layui-input-inline">
      	<input type="text" id="zontotal" lay-verify="required" readonly="readonly" value="0.00" autocomplete="off" class="layui-input">
    </div>
    总数量：
    <div class="layui-input-inline">
      	<input type="text"  id="zonnumber" lay-verify="required" readonly="readonly" value="0" autocomplete="off" class="layui-input">
    </div>
 <input type="button" value="一键添加" id="btn" class="layui-btn layui-btn-lg" />
 </div>
<table class="layui-table"  style="width:1000px;" lay-filter="test3" id="add">
  <thead>
    <tr>
      <th>药品名称</th>
      <th>数量</th>
      <th>单价</th>
      <th>数量单位</th>
      <th>备注</th>
      <th>总价</th>
      <th>操作</th>
    </tr>
  </thead>
  <tbody id="tbo">
  	
  </tbody>
</table>
	
	
	
		<div class="kit-table" id="kit-table">
		    <form class="layui-form" lay-filter="kit-search-form">
				<!-- 左上角的两个按钮 -->
		        <div class="kit-table-header">
		            <div class="kit-search-btns">
		            </div>
		            <div class="kit-search-inputs">
		                <div class="kit-search-keyword">
		                    <input type="text" class="layui-input" id="serach-one" placeholder="药品.." onKeyUp="lockInput(this,'serach-two')"/>
		                    <button lay-submit lay-filter="search"><i class="layui-icon">&#xe615;</i></button>
		                </div>
		                <div class="kit-search-more" id="kit-search-more">更多筛选<i class="layui-icon">&#xe61a;</i></div>
		            </div>
		        </div>
				<!-- 搜索扩展工具条 -->
		        <div class="kit-search-mored layui-anim layui-anim-upbit">
		            <div class="kit-search-body">
		                <div class="layui-form-item">
		                    <label class="layui-form-label">药品名称</label>
		                    <div class="layui-input-block">
		                        <input type="text" name="drugName" id="serach-two" placeholder="搜索关键字.." autocomplete="off" class="layui-input" onKeyUp="lockInput(this,'serach-one')">
		                    </div>
		                </div>
		                <div class="layui-form-item">
			                <label class="layui-form-label">类型</label>
			                <div class="layui-input-block">
			                    <select name="dtId">
			                      <option value=""></option>
			                      <option value="04f0c99f02324cac9c55b733e2d0e62a">感冒药</option>
			                      <option value="04f0c99f02324cac9c55b733e2d0ekksa">消炎药</option>
			                    </select>
			                </div>
		                </div>
		                <div class="layui-form-item">
		                    <div class="layui-inline">
		                        <label class="layui-form-label">范围</label>
		                        <div class="layui-input-block">
			                        <div class="layui-input-inline" style="width: 100px;">
			                            <input type="text" name="priceMin" placeholder="￥" autocomplete="off" class="layui-input" maxlength="6" onKeyUp="amount(this)">
			                        </div>
			                        <div class="layui-form-mid">-</div>
			                        <div class="layui-input-inline" style="width: 100px;">
			                            <input type="text" name="priceMax" placeholder="￥" autocomplete="off" class="layui-input" maxlength="6" onKeyUp="amount(this)">
			                        </div>
		                        </div>
		                    </div>
		                </div>
		            </div>
		            <div class="kit-search-footer">
		                <button type="reset" class="layui-btn layui-btn-sm layui-btn-primary kit-btn reset-btn">重置</button>
		                <button lay-submit lay-filter="search" class="layui-btn layui-btn-sm kit-btn">确定</button>
		            </div>
		        </div>
		    </form>
				
			<!-- 操作按钮 -->
		    <div class="kit-table-body">
		        <table id="demo" lay-filter="demo"></table>
		    </div>
		</div>
		<script>
			
		</script>
		<!-- 修改页面 -->
		<script type="text/html" id="edit-tpl">
		    <div style="margin:10px">
		        <form class="layui-form" action="" lay-filter="form-edit">
		            <input type="hidden" name="drugId" value="{{d.rowdata.drugId}}" />
		            <div class="layui-form-item">
		                <label class="layui-form-label">名称</label>
		                <div class="layui-input-block">
		                    <input type="text" name="drugName" required lay-verify="required" value="{{d.rowdata.drugName}}" placeholder="请输入标题" autocomplete="off" class="layui-input">
		                </div>
		            </div>
		            <div class="layui-form-item">
		                <label class="layui-form-label">类型</label>
		                <div class="layui-input-block">
		                    <select name="dtId" lay-verify="required">
		                      <option value=""></option>
		                      {{# layui.each(d.types,function(index,item){ }}                      
		                      {{# if(item.dtId===d.rowdata.dtId){}}
		                      <option value="{{item.dtId}}" selected>{{item.dtName}}</option>
		                      {{#}else{}}
		                      <option value="{{item.dtId}}">{{item.dtName}}</option>
		                      {{#};}}
		                      {{# }); }}
		                    </select>
		                </div>
		            </div>
					<div class="layui-form-item">
		                <label class="layui-form-label">单位</label>
		                <div class="layui-input-block">
		                    <input type="text" name="drugUnit" required lay-verify="required" value="{{d.rowdata.drugUnit}}" placeholder="请输入标题" autocomplete="off" class="layui-input">
		                </div>
		            </div>
					<div class="layui-form-item">
		                <label class="layui-form-label">属性</label>
		                <div class="layui-input-block">
		                    {{# var otc = d.rowdata.drugProp === '0'?'checked':'';}} {{# var rx = d.rowdata.drugProp === '1'?'checked':'';}}
		                    <input type="radio" name="drugProp" value="1" title="处方药" {{rx}} />
		                    <input type="radio" name="drugProp" value="0" title="非处方药" {{otc}} />
		                </div>
		            </div>
		            <div class="layui-form-item">
		                <label class="layui-form-label">价格</label>
		                <div class="layui-input-block">
		                    <input type="text" name="drugPrice" required lay-verify="required" maxlength="6" value="{{d.rowdata.drugPrice}}" placeholder="请输入认购数额（整数）" autocomplete="off" class="layui-input activity_card_money" onKeyUp="amount(this)">
		                </div>
		            </div>
					<div class="layui-upload">
                		<label class="layui-form-label">头像:</label>
                		<div class="layui-upload layui-input-block">
                    		<input type="hidden" name="drugPictrue" value="{{d.rowdata.drugPictrue}}"/>
                    		<button type="button" class="layui-btn layui-btn-primary" id="fileBtn"><i class="layui-icon">&#xe67c;</i>选择文件</button>
                   	 		<button type="button" class="layui-btn layui-btn-warm" id="uploadBtn">开始上传</button>
                		</div>
            		</div>
					
		            <div class="layui-form-item" style="display:none;">
		                <div class="layui-input-block">
		                    <button class="layui-btn" lay-submit lay-filter="formEdit">立即提交</button>
		                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
		                </div>
		            </div>
		        </form>
		    </div>
		</script>
		<script>
			var amount =0;
			var money = 0.0;
			
			//为隐藏的文本框赋值
			function num(obj){
				amount =0;
				money = 0.0;
				
				var id = obj.id;
				var a = parseFloat(obj.value);//数量
				var b=$(obj).parent().next().text();//单价
				var c =parseFloat(a)*parseFloat(b);//总价
				var d = c.toFixed(2);//截取后两位小数
				$(obj).parent().parent().children().eq(5).text(d);
				
				$("#tbo").find("tr").each(function(){
					amount += parseFloat($(this).find("td:eq(1) input").val());
					money += parseInt($(this).find("td:eq(5)").text());
				});
				var e = money.toFixed(2);
				$("#zontotal").val(e);
				$("#zonnumber").val(amount);
								
				pj();
			}
			/**
			* 拼接的方法
			*/
			function pj(){
				var   buyId=getParameter("id");//获取buyid
				
				//赋值
				var str = ""; 
				//拼接
				$("#tbo").find("tr").each(function(){
					  $(this).children('td').each(function(j){ 
						  str+=$(this).text()+"#";
					  });
					  str+=$(this).find("td:eq(1) input").val()+"#";
					  str+=$(this).find("td:eq(4) input").val()+"#";
					  str+=$(this).find("td:eq(7) input").val()+"#";
					  if(buyId!=null){
						  str+=amount+"#"+money+"#"+buyId+"&";
					  }else{
						  str+=amount+"#"+money+"&";
					  }
					  
				});
				$("#mes").val(str);
			}
			function remove(obj){
				$(obj).closest("tr").remove();
				from.radom
			}
						//文本框只能输入金额
		    function amount(th){
		        var regStrs = [
		            ['^0(\\d+)$', '$1'], //禁止录入整数部分两位以上，但首位为0
		            ['[^\\d\\.]+$', ''], //禁止录入任何非数字和点
		            ['\\.(\\d?)\\.+', '.$1'], //禁止录入两个以上的点
		            ['^(\\d+\\.\\d{2}).+', '$1'] //禁止录入小数点后两位以上
		        ];
		        for(i=0; i<regStrs.length; i++){
		            var reg = new RegExp(regStrs[i][0]);
		            th.value = th.value.replace(reg, regStrs[i][1]);
		        }
		    }
			/**
			* 获取id的方法
			*/
		    function getParameter(param){
	    		var query = window.location.search;
	    		var iLen = param.length;
	    		var iStart = query.indexOf(param);
	    		if (iStart == -1)
	    			return "";
	    		iStart += iLen + 1;
	    		var iEnd = query.indexOf("&", iStart);
	    		if (iEnd == -1)
	    			return query.substring(iStart);

	    		return query.substring(iStart, iEnd);
	    	}
			/**
			* 移除当前行
			*/
			
		    function delrow(obj){
                //获取按钮所在的行
                btnTrElement = obj.parentNode.parentNode;
                //alert(btnTrElement.nodeName);
                //获取按钮所在的行的上一级也就是TBODY
                tbodyElemement = btnTrElement.parentNode;
                //通过tobody干掉tr
                tbodyElemement.removeChild(btnTrElement);
            }
			//搜索框同步输入
			function lockInput(obj,id){
				$("#"+id).val($(obj).val());
			}
		</script>
		<script src="../../res/layui/layui.all.js"></script>
		<script>
			var a = new Array();
			//显示表格数据
		    layui.use(['table','upload'], function() {
		        var table = layui.table,
		            $ = layui.jquery,
		            layer = layui.layer,
		            form = layui.form,
		            laytpl = layui.laytpl;
		        
		        var tableIns = table.render({
		            elem: '#demo',
		            height: '449px', //容器高度
		            url: '../../drug/showChecked.action',
		            where :{"comId": 0},
		            page: true,
		            id: 'demo',
		            cols: [
		                [{checkbox: true,fixed: false},
		                {field: 'drugId',title: 'ID', width: 273},
		                {field: 'drugName',title: '药名',width: 175},
		                {field: 'dtName',title: '类型',width: 80},
		                {field: 'drugUnit',title: '单位',width: 80},
		                {field: 'diAmount',title: '库存',width: 90},
		                {field: 'drugPictrue',title: '图片',width: 60,templet:'<div><img style="height:100%;height:30px;" src="../../{{ d.drugPictrue}}"></div>'},
		                {field: 'drugPrice',title: '价格（元）',width: 150,sort: true}]
		            ],
		            done: function(res, curr, count) {
		                $("[data-field = 'drugProp']").children().each(function(){
						    if($(this).text() == '1'){
						    	$(this).text("处方药");
						    } else if ($(this).text() == '0') {
						    	$(this).text("非处方药");
						    }
					  	});
		                /* $("[data-field = 'drugPictrue']").children().each(function(){
						    if($(this).text() == 'null'||$(this).text() == ''){
						    	$(this).text("暂无");
						    }
					  	}); */
		            },
		            loading: true,
		        });
		        
		        
					
		      	//监听表格复选框选择
		        table.on('checkbox(demo)', function(obj){
		        	
		        	var data = obj.data;
		        	console.log(obj);
		        	 $("#tbo").append("<tr><td>"+data.drugName+"</td><td><input type='number' id='up_"+data.drugId+"' class='numbers' style='height:20px; border:0px; width:80px;' onKeyUp='num(this)' value='1' /></td><td id='pic_"+data.drugId+"'>"+data.drugPrice+"</td><td>"+data.drugUnit+"</td><td><input type='text' id='mes_"+data.drugId+"' style='height:20px; border:0px; width:200px;' onKeyUp='pj()'/></td><td id='total'>"+data.drugPrice+"</td><td><a onclick='delrow(this);' class='dels'>删除</a></td><td style='display:none;' id='"+data.drugId+"' ><input type='text' id='drugId' value='"+data.drugId+"' /></td></tr>")
		        	 if(obj.checked==false){
	        	      	/*	alert(data.stockId)*/
	        	      		//循环一个表的tr
	        	      		$("#add").find("tr").each(function(index,item){
	        	      			//获取元素节点控件
	        	      			 var aaa=$(item).children().get(7);
	        	      			 //获取节点属性td里的id
	        	      			 var drugId=$(aaa).prop("id");
	        	      			  //判断获取到的id不为空
	        	      			 if(drugId!=undefined){
	        	      				 //判断id相等
	        	      				 if(drugId==data.drugId){
	        	      					 //根据控件找到tr删除一行
	        	          				$(aaa).closest('tr').remove();
	        	      				 }
	        	      				
	        	      			 }
	        	      			 
	        	      		})
		        	      		
		        	      		
	        	      	}
		        	 num(obj);
		        	 
		        	
		        });
		        function closeLayer(){
				    //当你在iframe页面关闭自身时
					var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
					parent.layer.close(index); //再执行关闭   
				}
		      	
		      	/**
		      	* 采购表移除药品
		      	*/
		      	$('body').on('click','dels',function(){
		      		$(this).closest('tr').remove();
		      	})
		      	
		        //监听搜索表单提交
		        form.on('submit(search)', function(data) {
		            //带条件查询
		            tableIns.reload({
		                where: data.field
		            });
		            $('.kit-search-mored').hide();
		            return false;
		        });
		        
		        //表单渲染
		        form.render(null, 'kit-search-form');
		        //更多筛选点击事件
		        $('#kit-search-more').on('click', function() {
		            $('.kit-search-mored').toggle();
		        });
		        var editIndex;
		    });
		    
			/**
			* 点击行选中
			*/
		    $(document).on("click",".layui-table-body table.layui-table tbody tr", function () { var index = $(this).attr('data-index'); var tableBox = $(this).parents('.layui-table-box'); //存在固定列
		    if (tableBox.find(".layui-table-fixed.layui-table-fixed-l").length>0) { tableDiv = tableBox.find(".layui-table-fixed.layui-table-fixed-l"); } else { tableDiv = tableBox.find(".layui-table-body.layui-table-main"); } var checkCell = tableDiv.find("tr[data-index=" + index + "]").find("td div.laytable-cell-checkbox div.layui-form-checkbox I"); if (checkCell.length>0) { checkCell.click(); } }); $(document).on("click", "td div.laytable-cell-checkbox div.layui-form-checkbox", function (e) { e.stopPropagation(); });
		    	
		    $("#btn").click(function(){
		    	
		    	var index = layer.load(1, {
		        	  shade: [0.8,'#fff'] //0.1透明度的白色背景
		        	});
		    	
					var url="../../buyDetail/add.action";
					var data={"mes":$("#mes").val()};
					$.post(url,data,function(mes){
						if(mes.status==1){
							layer.msg("采购成功");
							  window.parent.location.reload()
	    					  var index=parent.layer.getFrameIndex(window.name);
	    					  parent.layer.close(index);
							
						}else{
							layer.msg(mes.msg);
							 
						}
						
					},"json");
				})
		   
		   
		</script>
		
   		<input type="hidden" name="mes" id="mes"/>
	</body>
</html>
